// 按钮工具类
// 从global.scss中提取的按钮相关工具类

// 导入变量
@use '../core/variables' as *;

// 按钮样式
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  border-radius: $border-radius-base;
  font-size: $font-size-sm;
  cursor: pointer;
  transition: all 0.3s;
  border: 1px solid transparent;
  outline: none;
  
  &--primary {
    background-color: $primary-color;
    color: white;
    
    &:hover {
      background-color: darken($primary-color, 10%);
    }
  }
  
  &--secondary {
    background-color: white;
    border-color: $border-color;
    color: $text-color-secondary;
    
    &:hover {
      background-color: #fafafa;
    }
  }
  
  &--success {
    background-color: $success-color;
    color: white;
    
    &:hover {
      background-color: darken($success-color, 10%);
    }
  }
  
  &--warning {
    background-color: $warning-color;
    color: white;
    
    &:hover {
      background-color: darken($warning-color, 10%);
    }
  }
  
  &--danger {
    background-color: $error-color;
    color: white;
    
    &:hover {
      background-color: darken($error-color, 10%);
    }
  }
  
  &--sm {
    padding: 4px 10px;
    font-size: $font-size-xs;
  }
  
  &--lg {
    padding: 10px 20px;
    font-size: $font-size-base;
  }
  
  &--block {
    display: flex;
    width: 100%;
  }
  
  &:disabled {
    opacity: 0.5;
    cursor: not-allowed;
  }
} 